<template>
	<view class="">
		<view class="cash-card mlr-36 mt-20">
			<view class="size-32 pl-30 pt-22 pb-22 bb">
				提现额度
			</view>
			<view class="size-40 pl-30 pt-32 pb-32 bb">
				<input type="number" v-model="money" value="" placeholder="请输入金额"/>
			</view>
			<view class="size-26 pl-30 mt-20 pb-20 red">
				可提现余额 {{userInfo.money}} 元
			</view>
			<view class="size-26 pl-30 pb-10 yellow">
				提现费率为{{set.withdraw_rate}},每天提现次数{{set.withdraw_day}}次
			</view>
			<view class="size-26 pl-30 pb-20 yellow">
				最大提现金额{{set.withdraw_max}}元,最小提现金额{{set.withdraw_min}}元
			</view>
		</view>
		<view class="plr-36 mt-50">
			提现
		</view>
		<view class="cash-ul plr-36 flex">
			<view class="cash-li mt-34 center pt-32 pb-32 border-pink border-yellow">
				<image src="../../static/zfb.png" mode=""></image>
				<text class="u-m-l-20">支付宝提现</text>
			</view>
		</view>
		<view class="cash-card1 mlr-36 mt-50">
			<view class="size-32 pl-30 pt-22 pb-22 bb">
				提现账号
			</view>
			<view class="pl-30 pr-30 pt-22 pb-22 bb flex">
				<view class="u-font-26">
					支付宝账号
				</view>
				<view class="">
					<input type="text" v-model="account" value="" placeholder="请输入支付宝账号" class="u-font-26 text-right" />
				</view>
			</view>
			<view class="pl-30 pr-30 pt-22 pb-22 flex">
				<view class="u-font-26">
					真实姓名
				</view>
				<view class="">
					<input type="text" value="" v-model="name" placeholder="请输入真实姓名" class="u-font-26 text-right" />
				</view>
			</view>
		</view>

		<u-button @click="submit" type="warning" :disabled="!money || !account || !name" class="mlr-36 mt-100">确认提现</u-button>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex'
	export default {
		data() {
			return {
				set:{},
				money: '',
				account: '',
				name: '',
			}
		},
		computed: {
			...mapState(["userInfo"])
		},
		onLoad() {
			this.$http('/api/user/cash_set').then(data=>{
				this.set = data.cash_set
			})
		},
		methods: {
			submit() {
				if (this.money * 1 > this.userInfo.money) {
					uni.showToast({
						title: '余额不足',
						icon: 'none'
					})
					this.money = ''
				}else if (this.money * 1 > this.set.withdraw_max) {
					uni.showToast({
						title: '最大限额'+this.set.withdraw_max,
						icon: 'none'
					})
					this.money = ''
				} else if (this.money < this.set.withdraw_min) {
					uni.showToast({
						title: '最少提现'+this.set.withdraw_min+'元',
						icon: 'none'
					})
					this.money = ''
				} else {
					this.$http('/api/user/sbCash', {
						money: this.money,
						account_number: this.account,
						payee: this.name
					}, "POST").then(data => {
						uni.showToast({
							title: '提现成功'
						})
						this.$store.dispatch('updateUserInfo')
						setTimeout(()=>{
							uni.navigateBack({
							})
						},1000)
					}).catch(data => {

					})
				}

			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background: #F8F8F8;
	}

	.cash-card {
		background: #fff;
		border-radius: 10rpx;
		box-shadow: 0px 0px 24px 0px rgba(187, 187, 187, 0.36);
	}

	.cash-li {
		width: 48%;
		background: #fff;
		border-radius: 10rpx;
		box-shadow: 0px 0px 24px 0px rgba(187, 187, 187, 0.36);

		image {
			width: 55rpx;
			height: 55rpx;
			border-radius: 50%;
		}
	}

	.cash-card1 {
		background: #fff;
		border-radius: 10rpx;
		box-shadow: 0px 0px 24px 0px rgba(187, 187, 187, 0.36);
	}
</style>
